<template>
  <div id="app">
    <el-breadcrumb separator-class="el-icon-arrow-right" style="font-size: 16px;">
      <el-breadcrumb-item :to="{ path: '/sys-admin' }">
        <i class="el-icon-s-promotion"></i> 后台管理
      </el-breadcrumb-item>
      <el-breadcrumb-item>商品详情</el-breadcrumb-item>
    </el-breadcrumb>

    <el-divider></el-divider>
    <el-main style="width: 1200px;margin: 0 auto;">
      <el-row >
        <el-col style="width: 50%">
          <el-card>
            <img class="p_img" :src="require('D:/Tedu/tedu/data-management-system/files'+product.url)" width="100%"  alt="">
          </el-card>
        </el-col>
        <el-col >
          <p style="font-size: 35px">
            {{product.title}}
          </p>
          <el-divider></el-divider>
          <p style="font-size: 25px;color: #666">
            销量:{{product.sale_count}}
            <span style="float: right">{{product.created}}</span>
          </p>
          <p style="font-size: 55px;font-weight: bold">
            ￥ {{product.price}}
            <span style="font-size: 35px;color: #666">原价:<s>{{product.old_price}}</s></span>
          </p>
          <el-row >
            <el-col :span="8">
              <el-card>
                <img  :src="`${publicPath}ewm.jpg`" width="100%" alt="">
              </el-card>
              <p style="text-align: center;font-size: 24px">扫码关注公众号</p>
            </el-col >
            <el-col :span="8">
              <el-card>
                <img  :src="`${publicPath}ewm.jpg`" width="100%" alt="">
              </el-card>
              <p style="text-align: center;font-size: 24px" >扫码购买商品</p>
            </el-col>
            <el-col  :span="8">
              <el-card>
                <img  :src="`${publicPath}ewm.jpg`" width="100%" alt="">
              </el-card>
              <p style="text-align: center;font-size: 24px">扫码下载App</p>
            </el-col>
          </el-row>
        </el-col>
      </el-row>
    </el-main>

  </div>
</template>

<script>
export default {
  data: function () {
    return {
      publicPath: process.env.BASE_URL,
      product:{},
    };
  },
  methods: {
    goBack(){
      //返回上一页面
      history.back();
    },
    loadServerId(){
      let url="http://localhost:9081/product/selectById"
      this.axios
          .create({"headers":{'Authorization':localStorage.getItem("jwt")}})
          .get(url+location.search).then((response)=> {
        this.product = response.data;
      })
    }
  },
  mounted() {
    this.loadServerId();
  }
}

</script>

<style scoped>

</style>